<template>
  <el-container>
    <el-container class="full-container">
      <div class="full">
        <blockquote class="search">
          <div class="table-top-bar">
            <h5 class="title">卫星台站信息</h5>
            <el-button
              :size="table.btnSize"
              type="text"
              class="link-btn"
              @click="handleAdd();">新增</el-button>
          </div>
          <el-form
            ref="searchForm"
            :model="queryParams"
            :size="form.size"
            :inline-message="form.inlineMessage"
            :status-icon="form.statusIcon"
            :inline="true"
            label-width="70"
            auto-complete="off">
            <el-form-item
              label="站点ID"
              prop="stationId">
              <el-input
                v-model="queryParams.stationId"
                placeholder="站点ID" />
            </el-form-item>
            <el-form-item>
              <el-button
                :size="table.btnSize"
                type="primary"
                @click="loadData(true)">搜索</el-button>
            </el-form-item>
          </el-form>
        </blockquote>
        <el-table
          v-loading="table.loading"
          :size="table.size"
          :height="tableHeight"
          :highlight-current-row="table.highlightCurrentRow"
          :stripe="table.stripe"
          :border="table.border"
          :data="page.rows"
          :header-row-class-name="table.headerClass"
          row-key="id"
          @sort-change="sortChange">
          <el-table-column
            prop="stationId"
            label="站点ID"
            min-width="100"/>
          <el-table-column
            prop="stationName"
            label="站点名称"
            min-width="100"/>
          <el-table-column
            prop="longitude"
            label="经度"
            min-width="100"/>
          <el-table-column
            prop="latitude"
            label="纬度"
            min-width="100"/>
          <el-table-column
            prop="sampleInterval"
            label="时间间隔(秒)"
            min-width="100"/>
          <el-table-column
            prop="antennaType"
            label="天线类型"
            min-width="100"/>
          <el-table-column
            prop="antennaElevation"
            label="海拔高度"
            min-width="100"/>
          <el-table-column
            prop="antennaHeight"
            label="天线高度"
            min-width="100"/>
          <el-table-column
            prop="receiverType"
            label="接收机类型"
            min-width="100"/>
          <el-table-column
            prop="stationNaMech"
            label="站点设备"
            min-width="100"/>
          <el-table-column
            prop="fileType"
            label="文件类型"
            min-width="100"/>
          <el-table-column
            prop="province"
            label="省份"
            min-width="100"/>
          <el-table-column
            prop="reStationName"
            label="站点新名称"
            min-width="100"/>
          <el-table-column
            prop="choseYn"
            label="是否选择"
            min-width="100"/>
          <el-table-column
            fixed="right"
            label="操作"
            width="80"
            class-name="cell-opts"
            align="center">
            <template slot-scope="scope">
              <el-button
                :size="table.cellBtnSize"
                type="text"
                @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          :page-size="queryParams.pageSize?queryParams.pageSize:20"
          :layout="pageLayout"
          :background="pagination.background"
          :small="pagination.small"
          :prev-text="pagination.prevText"
          :next-text="pagination.nextText"
          :current-page="page.curPage ? page.curPage: 1"
          :page-sizes="pagination.pageSizes"
          :total="page.total?page.total:0"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"/>
      </div>
      <el-dialog
        :width="dialog.add.width"
        :title="dialog.add.title"
        :visible.sync="dialog.add.visible"
        :close-on-click-modal="dialog.add.closeOnClickModal"
        :fullscreen="dialog.add.fullscreen"
        :before-close="handleAddClose">
        <el-form
          ref="submitAddForm"
          :model="form.add"
          :size="form.size"
          :rules="rules.add"
          :label-width="form.labelWidth"
          :inline-message="form.inlineMessage"
          :status-icon="form.statusIcon"
          auto-complete="off">
          <el-form-item
            label="站点ID"
            prop="stationId">
            <el-input
              v-model="form.add.stationId"
              placeholder="站点ID"/>
          </el-form-item>
          <el-form-item
            label="站点名称"
            prop="stationName">
            <el-input
              v-model="form.add.stationName"
              placeholder="站点名称"/>
          </el-form-item>
          <el-form-item
            label="经度"
            prop="longitude">
            <el-input
              v-model="form.add.longitude"
              placeholder="经度"/>
          </el-form-item>
          <el-form-item
            label="纬度"
            prop="latitude">
            <el-input
              v-model="form.add.latitude"
              placeholder="纬度"/>
          </el-form-item>
          <el-form-item
            label="时间间隔(秒)"
            prop="sampleInterval">
            <el-input
              v-model="form.add.sampleInterval"
              placeholder="时间间隔(秒)"/>
          </el-form-item>
          <el-form-item
            label="天线类型"
            prop="antennaType">
            <el-input
              v-model="form.add.antennaType"
              placeholder="天线类型"/>
          </el-form-item>
          <el-form-item
            label="海拔高度"
            prop="antennaElevation">
            <el-input
              v-model="form.add.antennaElevation"
              placeholder="海拔高度"/>
          </el-form-item>
          <el-form-item
            label="天线高度"
            prop="antennaHeight">
            <el-input
              v-model="form.add.antennaHeight"
              placeholder="天线高度"/>
          </el-form-item>
          <el-form-item
            label="接收机类型"
            prop="receiverType">
            <el-input
              v-model="form.add.receiverType"
              placeholder="接收机类型"/>
          </el-form-item>
          <el-form-item
            label="站点设备"
            prop="stationNaMech">
            <el-input
              v-model="form.add.stationNaMech"
              placeholder="站点设备"/>
          </el-form-item>
          <el-form-item
            label="文件类型"
            prop="fileType">
            <el-input
              v-model="form.add.fileType"
              placeholder="文件类型"/>
          </el-form-item>
          <el-form-item
            label="省份"
            prop="province">
            <el-input
              v-model="form.add.province"
              placeholder="省份"/>
          </el-form-item>
          <el-form-item
            label="站点新名称"
            prop="reStationName">
            <el-input
              v-model="form.add.reStationName"
              placeholder="站点新名称"/>
          </el-form-item>
          <el-form-item
            label="是否选择"
            prop="choseYn">
            <el-input
              v-model="form.add.choseYn"
              placeholder="是否选择"/>
          </el-form-item>
        </el-form>
        <span
          slot="footer"
          class="dialog-footer">
          <el-button
            :size="table.btnSize"
            @click="resetForm('submitAddForm','add')">取 消</el-button>
          <el-button
            :size="table.btnSize"
            type="primary"
            @click="submitAdd()">确 定</el-button>
        </span>
      </el-dialog>
      <el-dialog
        :width="dialog.edit.width"
        :title="dialog.edit.title"
        :visible.sync="dialog.edit.visible"
        :close-on-click-modal="dialog.edit.closeOnClickModal"
        :fullscreen="dialog.edit.fullscreen"
        :before-close="handleEditClose">
        <el-form
          ref="submitEditForm"
          :model="form.edit"
          :size="form.size"
          :rules="rules.edit"
          :label-width="form.labelWidth"
          :inline-message="form.inlineMessage"
          :status-icon="form.statusIcon"
          auto-complete="off">
          <el-form-item
            label="站点ID"
            prop="stationId">
            <el-input
              v-model="form.edit.stationId"
              placeholder="站点ID"/>
          </el-form-item>
          <el-form-item
            label="站点名称"
            prop="stationName">
            <el-input
              v-model="form.edit.stationName"
              placeholder="站点名称"/>
          </el-form-item>
          <el-form-item
            label="经度"
            prop="longitude">
            <el-input
              v-model="form.edit.longitude"
              placeholder="经度"/>
          </el-form-item>
          <el-form-item
            label="纬度"
            prop="latitude">
            <el-input
              v-model="form.edit.latitude"
              placeholder="纬度"/>
          </el-form-item>
          <el-form-item
            label="时间间隔(秒)"
            prop="sampleInterval">
            <el-input
              v-model="form.edit.sampleInterval"
              placeholder="时间间隔(秒)"/>
          </el-form-item>
          <el-form-item
            label="天线类型"
            prop="antennaType">
            <el-input
              v-model="form.edit.antennaType"
              placeholder="天线类型"/>
          </el-form-item>
          <el-form-item
            label="海拔高度"
            prop="antennaElevation">
            <el-input
              v-model="form.edit.antennaElevation"
              placeholder="海拔高度"/>
          </el-form-item>
          <el-form-item
            label="天线高度"
            prop="antennaHeight">
            <el-input
              v-model="form.edit.antennaHeight"
              placeholder="天线高度"/>
          </el-form-item>
          <el-form-item
            label="接收机类型"
            prop="receiverType">
            <el-input
              v-model="form.edit.receiverType"
              placeholder="接收机类型"/>
          </el-form-item>
          <el-form-item
            label="站点设备"
            prop="stationNaMech">
            <el-input
              v-model="form.edit.stationNaMech"
              placeholder="站点设备"/>
          </el-form-item>
          <el-form-item
            label="文件类型"
            prop="fileType">
            <el-input
              v-model="form.edit.fileType"
              placeholder="文件类型"/>
          </el-form-item>
          <el-form-item
            label="省份"
            prop="province">
            <el-input
              v-model="form.edit.province"
              placeholder="省份"/>
          </el-form-item>
          <el-form-item
            label="站点新名称"
            prop="reStationName">
            <el-input
              v-model="form.edit.reStationName"
              placeholder="站点新名称"/>
          </el-form-item>
          <el-form-item
            label="是否选择"
            prop="choseYn">
            <el-input
              v-model="form.edit.choseYn"
              placeholder="是否选择"/>
          </el-form-item>
        </el-form>
        <span
          slot="footer"
          class="dialog-footer">
          <el-button
            :size="table.btnSize"
            @click="resetForm('submitEditForm','edit')">取 消</el-button>
          <el-button
            :size="table.btnSize"
            type="primary"
            @click="submitEdit()">确 定</el-button>
        </span>
      </el-dialog>
    </el-container>
  </el-container>
</template>
<script>
import Mixin from '@/assets/mixin'
export default {
  name: 'SatelliteStation',
  mixins: [Mixin],
  data() {
    return {
      form: {
        add: {
          stationId: '',
          stationName: '',
          longitude: '',
          latitude: '',
          sampleInterval: '',
          antennaType: '',
          antennaElevation: '',
          antennaHeight: '',
          receiverType: '',
          stationNaMech: '',
          fileType: '',
          province: '',
          reStationName: '',
          choseYn: '',
          id: ''
        },
        edit: {
          stationId: '',
          stationName: '',
          longitude: '',
          latitude: '',
          sampleInterval: '',
          antennaType: '',
          antennaElevation: '',
          antennaHeight: '',
          receiverType: '',
          stationNaMech: '',
          fileType: '',
          province: '',
          reStationName: '',
          choseYn: '',
          id: ''
        }
      },
      rules: {
        add: {
          stationId: [
            { required: true, message: '请输入站点ID', trigger: 'blur' }
          ],
          stationName: [
            { required: true, message: '请输入站点名称', trigger: 'blur' }
          ],
          longitude: [
            { required: true, message: '请输入经度', trigger: 'blur' }
          ],
          latitude: [
            { required: true, message: '请输入纬度', trigger: 'blur' }
          ],
          sampleInterval: [
            { required: true, message: '请输入时间间隔(秒)', trigger: 'blur' }
          ],
          antennaType: [
            { required: true, message: '请输入天线类型', trigger: 'blur' }
          ],
          antennaElevation: [
            { required: true, message: '请输入海拔高度', trigger: 'blur' }
          ],
          antennaHeight: [
            { required: true, message: '请输入天线高度', trigger: 'blur' }
          ],
          receiverType: [
            { required: true, message: '请输入接收机类型', trigger: 'blur' }
          ],
          stationNaMech: [
            { required: true, message: '请输入站点设备', trigger: 'blur' }
          ],
          fileType: [
            { required: true, message: '请输入文件类型', trigger: 'blur' }
          ],
          province: [
            { required: true, message: '请输入省份', trigger: 'blur' }
          ],
          reStationName: [
            { required: true, message: '请输入站点新名称', trigger: 'blur' }
          ],
          choseYn: [
            { required: true, message: '请输入是否选择', trigger: 'blur' }
          ],
          id: []
        },
        edit: {
          stationId: [
            { required: true, message: '请输入站点ID', trigger: 'blur' }
          ],
          stationName: [
            { required: true, message: '请输入站点名称', trigger: 'blur' }
          ],
          longitude: [
            { required: true, message: '请输入经度', trigger: 'blur' }
          ],
          latitude: [
            { required: true, message: '请输入纬度', trigger: 'blur' }
          ],
          sampleInterval: [
            { required: true, message: '请输入时间间隔(秒)', trigger: 'blur' }
          ],
          antennaType: [
            { required: true, message: '请输入天线类型', trigger: 'blur' }
          ],
          antennaElevation: [
            { required: true, message: '请输入海拔高度', trigger: 'blur' }
          ],
          antennaHeight: [
            { required: true, message: '请输入天线高度', trigger: 'blur' }
          ],
          receiverType: [
            { required: true, message: '请输入接收机类型', trigger: 'blur' }
          ],
          stationNaMech: [
            { required: true, message: '请输入站点设备', trigger: 'blur' }
          ],
          fileType: [
            { required: true, message: '请输入文件类型', trigger: 'blur' }
          ],
          province: [
            { required: true, message: '请输入省份', trigger: 'blur' }
          ],
          reStationName: [
            { required: true, message: '请输入站点新名称', trigger: 'blur' }
          ],
          choseYn: [
            { required: true, message: '请输入是否选择', trigger: 'blur' }
          ],
          id: []
        }
      },
      submit: {
        add: {
          url: '/v3/collect/satelliteStation',
          method: 'POST'
        },
        edit: {
          url: '/v3/collect/satelliteStation/',
          method: 'PUT'
        }
      },
      url: '/v3/collect/satelliteStation'
    }
  }
}
</script>
